<!DOCTYPE html>
<html lang="en">
    
<head>
    {% include head.html %}
</head>

<body class="home-template" itemscope itemtype="http://schema.org/WebPage">
{% if site.search %}
<div class="search-wrapper">
    <div class="search-form">
        <input type="text" id="search-input" class="search-field" placeholder="Search...">
        <i id="search-close" class="fa fa-times-circle"></i>
        <h4>Search results</h4>
        <ul id="results-container" class="search-results post-list">
        </ul>
        <!-- /.search-results -->
    </div>
    <!-- /.search-form -->
</div>
<!-- ./search-wrapper -->
{% endif %}
    <div id="fade"></div>
    <a id="slide" class="animated fade"></a>
    <aside id="sidebar">
        <nav id="navigation">
            <h2>MENU</h2> <hr>
            <ul>
{% for link in site.links %}
                <li>
                {% if link.external %}
                    <a href="{{ link.url }}">{{ link.title }}</a>
                {% else %}
                    <a href="{{ link.url }}">{{ link.title }}</a>
                {% endif %}
                </li>
{% endfor %}            
                <li><a href="/feed.xml" title="Atom/RSS feed"><i class="fa fa-rss"></i> Feed</a></li>
            </ul>
        </nav>
    </aside>

{% if page.imagefeature %}
    <header id="masthead" class="blog-background overlay align-center align-middle animated from-bottom"  style="background-image: url(/images/{{ page.imagefeature }})" itemscope itemtype="http://schema.org/Organization">
{% else %}
    <header id="masthead" class="blog-background overlay align-center align-middle animated from-bottom"  style="background-image: url(/images/{{ site.default_bg }})" itemscope itemtype="http://schema.org/Organization">
{% endif %}

{% if site.search %}
        <button class="menu-button animated fade dosearch">
            <i class="fa fa-search"></i>
        </button>
{% endif %}

{% if site.description %}
        <div class="inner">
            <div class="container">
                <a class="brand light" href="" itemprop="url">
                    {% if site.logo %} <img itemprop="logo" src="/images/{{ site.logo }}" alt="{{ site.title }} Logo" /> {% endif %}
                    <h1 class="blog-title light" itemprop="name">
                        {{ site.title }}
                    </h1>
                </a>
                <h2 class="blog-description light bordered bordered-top" itemprop="description">
                    {{ site.description }}
                </h2>
            </div>
        </div>
{% else %}
        <div class="inner">
            <div class="container">
                <a class="brand" href="" itemprop="url">
                    <img itemprop="logo" src="/images/{{ site.logo }}" alt="{{ site.title }} Logo" />
                <h1 class="blog-title light" itemprop="name">
                    {{ site.title }}
                </h1>
                </a>
            </div>
        </div>
{% endif %}

{% if site.animated_fins and site.triangleheader %}
        <div class="decor-wrapper">
            <svg id="header-decor" class="decor bottom" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100" preserveAspectRatio="none">
                <path class="large left" d="M0 0 L50 50 L0 100" fill="rgba({{ site.fin_color }}, .1)"></path>
                <path class="large right" d="M100 0 L50 50 L100 100" fill="rgba({{ site.fin_color }}, .1)"></path>
                <path class="medium left" d="M0 100 L50 50 L0 33.3" fill="rgba({{ site.fin_color }}, .3)"></path>
                <path class="medium right" d="M100 100 L50 50 L100 33.3" fill="rgba({{ site.fin_color }}, .3)"></path>
                <path class="small left" d="M0 100 L50 50 L0 66.6" fill="rgba({{ site.fin_color }}, .5)"></path>
                <path class="small right" d="M100 100 L50 50 L100 66.6" fill="rgba({{ site.fin_color }}, .5)"></path>
                <path d="M0 99.9 L50 49.9 L100 99.9 L0 99.9" fill="rgba(255,255,255, 1)"></path>
                <path d="M48 52 L50 49 L52 52 L48 52" fill="rgba(255,255,255, 1)"></path>
            </svg>
        </div>
{% else %}
    {% if site.triangleheader %}
        <div class="decor-wrapper">
            <svg id="header-decor" class="decor bottom" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100" preserveAspectRatio="none">
                <path d="M0 99.9 L50 49.9 L100 99.9 L0 99.9" fill="rgba(255,255,255, 1)"></path>
                <path d="M48 52 L50 49 L52 52 L48 52" fill="rgba(255,255,255, 1)"></path>
            </svg>
        </div>
    {% endif %}
{% endif %}
    </header>

    <div id="main" class="content" role="main" itemprop="mainContentOfPage">
        <div class="container">
            <div class="row">
                <div class="page-body" itemprop="description">
                {{ content }}
                </div>    
            </div>
        </div>
    </div>

    {% include footer.html %}

    {% include scripts.html %}  
</body>
</html>